<template>
  <header class="header">
      <h1>todos</h1>
      <input class="new-todo" v-model.trim="values" placeholder="请输入任务名称" autofocus @keyup.enter="add(values)"/>
  </header>
</template>
<script>
export default {
  name: 'TodoHeader',
  props: {},
  data () {
    return {
      values: ''
    }
  },
  methods: {
    add (name) {
      this.$emit('add', name)
      this.values = ''
    }
  }

}
</script>c
<style lang='less' scoped>
</style>
